<template>
    <TableView
      ref="tableView"
      :table-attrs="{ api: getInventoryTaskAssetPage,
                    payloadStyle: 'body',
                    pageSize: 10,
                    descs: ['amount'],
                    dicOptions: [
                      { prop: 'assetStatus', dicType: 'asset_status' },
                      { prop: 'status', dicType: 'inventory_task_list_status' },
                    ] }"
      :search-model="searchForm"
      :delete-api="batchDelete"
      :toolbar-attrs="{ buttons: ['slot', { del: '', create: '' }] }">
      <template #toolbar-button="{ selectedRows }">
        <!-- 自定义按钮 -->
      </template>
      <template #columns>
        <TableColumn label="盘点状态" prop="status" width="70"/>
        <TableColumn label="资产状态" prop="assetStatus" width="70"/>
        <TableColumn label="资产名称" prop="name"/>
        <TableColumn label="资产编码" prop="number"/>
        <TableColumn label="资产类型" prop="ctiName"/>
        <TableColumn label="规格型号" prop="model"/>
        <TableColumn label="计量单位" prop="unit"/>
        <TableColumn label="金额" prop="amount"/>
        <TableColumn label="使用人" prop="useName"/>
        <TableColumn label="存放地点" prop="location"/>
      </template>
      <template #search-form>
        <FormSelect v-model="searchForm.status" dict-type="inventory_task_list_status" label="盘点状态" prop="status" style="width: 220px;"  />
        <FormSelect v-model="searchForm.assetStatus" dict-type="asset_status" label="资产状态" prop="assetStatus" style="width: 220px;"  />
        <FormInput v-model="searchForm.name" label="资产名称" prop="name"  style="width: 220px;" />
        <FormInput v-model="searchForm.number" label="资产编码"  prop="number" style="width: 220px;" />
        <FormInput v-model="searchForm.ctiName" label="资产类型"  prop="ctiName" style="width: 220px;" />
        <FormInput v-model="searchForm.model" label="规格型号"  prop="model" style="width: 220px;" />
        <FormInput v-model="searchForm.unit" label="计量单位"  prop="unit" style="width: 220px;" />
        <FormInput v-model="searchForm.useName" label="使用人"  prop="useName" style="width: 220px;" />
      </template>
    </TableView>
</template>

<script>
  import { mapState } from 'vuex'
  import { services } from '@/config'
  import { batchDelete, getInventoryTaskAssetPage } from '@/api/inventory/inventorytaskasset'

  export default {
    name: 'InventoryTaskAsset',
    props: {
      inventoryTaskId: {
        type: String,
        default: '-1'
      }
    },
    data() {
      return {
        searchForm: {
          status: '',
          assetStatus: '',
          name: '',
          number: '',
          ctiName: '',
          model: '',
          unit: '',
          useName: '',
          inventoryTaskId: this.inventoryTaskId,
          description: ''
        }
      }
    },
    computed: {
      services() {
        return services
      },
      ...mapState('user', ['permissions'])
    },
    created() {
      this.searchForm.inventoryTaskId = this.inventoryTaskId
    },
    methods: {
      getInventoryTaskAssetPage,
      batchDelete
    }
  }
</script>
